<div id="content_header">
  <h3>Installment for {{ currentCourse.CourseName }} - {{ currentCourse.Code }} </h3>
</div>

<div class="row">
  <form class="form-inline" role="form" ng-submit="addInstallment()">

    <div class="form-group">
      <label class="sr-only" for="term">label</label>
      <select name="term" class="form-control" id="term" ng-model="installmentNew.Term" ng-options="idx as term.Year +' / '+ term.Term for (idx, term) in terms" required>
        <option value="" ng-hide="installmentNew.Term">Select Term.</option>
      </select>
    </div>

    <div class="form-group">
      <label class="sr-only" for="amount">label</label>
      <input type="input" class="form-control" id="amount" placeholder="Installment Amount" ng-model="installmentNew.Amount">
    </div>

    <button type="submit" class="btn btn-primary">Add Installment</button>
  </form>
</div>

<div class="row">
  <table class="table table-stripped table-bordered" ng-show="currentCourse.Installments.length > 0">
    <thead>
      <tr>
        <th>No</th>
        <th>Term</th>
        <th>Fee</th>
        <th>Action</th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat="installment in currentCourse.Installments">
        <td>{{ $index+1 }}</td>
        <td>{{ terms[installment.Term].Year }} / {{ terms[installment.Term].Term }}</td>
        <td>{{ installment.Amount | currency: currencies[currentCourse.CurrencyId].CurrencyCode+' ' }}</td>
        <td>
          <a class="" href="" ng-click="deleteInstallment($index)"><i class="simple-icon-trash"></i></a>
        </td>
      </tr>
    </tbody>
  </table>
</div>